<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>为你推荐的礼物愿望 - 社交心愿平台</title>
    
    <!-- 引入外部资源 -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
    
    <style>
        :root {
            --primary: #6366F1;
            --primary-light: #8B5CF6;
            --secondary: #10B981;
            --accent: #F59E0B;
            --dark: #1F2937;
            --light: #F9FAFB;
            --gray: #6B7280;
            --light-gray: #E5E7EB;
            --shadow-sm: 0 2px 8px rgba(0,0,0,0.08);
            --shadow: 0 4px 16px rgba(0,0,0,0.12);
            --transition: all 0.3s ease;
            --radius: 12px;
        }
        
        body {
            font-family: 'Inter', system-ui, sans-serif;
            background-color: #F3F4F6;
            color: var(--dark);
            line-height: 1.6;
            padding-bottom: 3rem;
        }
        
        .container {
            max-width: 1200px;
        }
        
        /* 页面标题样式 */
        .page-header {
            padding: 2rem 0;
            margin-bottom: 2rem;
        }
        
        .page-title {
            font-size: 2rem;
            font-weight: 700;
            color: var(--primary);
            margin-bottom: 0.5rem;
            position: relative;
            display: inline-block;
        }
        
        .page-subtitle {
            font-size: 1rem;
            color: var(--gray);
            max-width: 800px;
        }
        
        /* 推荐标签样式 */
        .recommendation-tabs {
            display: flex;
            overflow-x: auto;
            padding-bottom: 0.5rem;
            margin-bottom: 1.5rem;
            gap: 10px;
            scrollbar-width: thin;
        }
        
        .recommendation-tabs::-webkit-scrollbar {
            height: 4px;
        }
        
        .recommendation-tabs::-webkit-scrollbar-thumb {
            background-color: var(--primary-light);
            border-radius: 2px;
        }
        
        .tab-item {
            white-space: nowrap;
            background-color: white;
            border: 1px solid var(--light-gray);
            border-radius: 20px;
            padding: 6px 18px;
            font-size: 0.9rem;
            cursor: pointer;
            transition: var(--transition);
            flex-shrink: 0;
            display: flex;
            align-items: center;
            gap: 6px;
        }
        
        .tab-item:hover, .tab-item.active {
            background-color: var(--primary);
            color: white;
            border-color: var(--primary);
        }
        
        /* 卡片容器样式 */
        .wish-container {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
            gap: 1.5rem;
            margin-bottom: 2rem;
        }
        
        /* 大卡片样式 */
        .featured-wish {
            grid-column: 1 / -1;
            display: grid;
            grid-template-columns: 1fr 1.2fr;
            gap: 1.5rem;
            background-color: white;
            border-radius: var(--radius);
            overflow: hidden;
            box-shadow: var(--shadow-sm);
            transition: var(--transition);
        }
        
        .featured-wish:hover {
            box-shadow: var(--shadow);
        }
        
        .featured-image {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
        
        .featured-content {
            padding: 1.5rem;
            display: flex;
            flex-direction: column;
        }
        
        /* 礼物愿望卡片基础样式 */
        .wish-card {
            background-color: white;
            border-radius: var(--radius);
            overflow: hidden;
            box-shadow: var(--shadow-sm);
            transition: var(--transition);
            position: relative;
            display: flex;
            flex-direction: column;
            height: 100%;
        }
        
        .wish-card:hover {
            transform: translateY(-5px);
            box-shadow: var(--shadow);
        }
        
        /* 推荐理由标签 */
        .recommendation-badge {
            position: absolute;
            top: 10px;
            left: 10px;
            background-color: var(--primary);
            color: white;
            border-radius: 4px;
            padding: 2px 8px;
            font-size: 0.7rem;
            font-weight: 600;
            z-index: 1;
        }
        
        /* 价格标签 */
        .price-tag {
            position: absolute;
            top: 10px;
            right: 10px;
            background-color: var(--accent);
            color: white;
            border-radius: 4px;
            padding: 3px 8px;
            font-size: 0.8rem;
            font-weight: 600;
            z-index: 1;
        }
        
        /* 图片容器样式 */
        .image-container {
            position: relative;
            overflow: hidden;
        }
        
        .card-image {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: var(--transition);
        }
        
        .wish-card:hover .card-image {
            transform: scale(1.05);
        }
        
        /* 多图布局 */
        .multi-images {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 4px;
            height: 100%;
        }
        
        .multi-image {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
        
        .multi-images.count-1 {
            grid-template-columns: 1fr;
        }
        
        .multi-images.count-3 {
            grid-template-rows: repeat(2, 1fr);
        }
        
        .multi-images.count-3 .multi-image:first-child {
            grid-column: span 2;
        }
        
        .multi-images.count-4 {
            grid-template-columns: repeat(2, 1fr);
            grid-template-rows: repeat(2, 1fr);
        }
        
        /* 图片数量指示器 */
        .image-count {
            position: absolute;
            bottom: 8px;
            right: 8px;
            background-color: rgba(0,0,0,0.6);
            color: white;
            border-radius: 4px;
            padding: 2px 6px;
            font-size: 0.75rem;
        }
        
        /* 内容样式 */
        .card-body {
            padding: 1rem;
            flex-grow: 1;
            display: flex;
            flex-direction: column;
        }
        
        .wish-category {
            display: inline-block;
            padding: 2px 8px;
            border-radius: 12px;
            font-size: 0.7rem;
            font-weight: 600;
            margin-bottom: 0.5rem;
            background-color: rgba(99, 102, 241, 0.1);
            color: var(--primary);
        }
        
        .wish-title {
            font-size: 1.1rem;
            font-weight: 600;
            margin-bottom: 0.5rem;
            color: var(--dark);
            transition: var(--transition);
            line-height: 1.4;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }
        
        .wish-card:hover .wish-title {
            color: var(--primary);
        }
        
        .wish-description {
            color: var(--gray);
            font-size: 0.85rem;
            margin-bottom: 1rem;
            line-height: 1.5;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
            flex-grow: 1;
        }
        
        /* 作者信息 */
        .author-info {
            display: flex;
            align-items: center;
            gap: 8px;
            margin-bottom: 0.75rem;
        }
        
        .author-avatar {
            width: 28px;
            height: 28px;
            border-radius: 50%;
            object-fit: cover;
        }
        
        .author-name {
            font-weight: 500;
            font-size: 0.8rem;
        }
        
        /* 互动统计 */
        .wish-stats {
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-size: 0.75rem;
            color: var(--gray);
            padding-top: 0.75rem;
            border-top: 1px dashed var(--light-gray);
        }
        
        .stat-item {
            display: flex;
            align-items: center;
            gap: 4px;
            cursor: pointer;
            transition: var(--transition);
        }
        
        .stat-item:hover {
            color: var(--primary);
        }
        
        /* 无图礼物样式 */
        .no-image-card {
            border: 1px solid var(--light-gray);
        }
        
        .no-image-body {
            padding: 1.25rem;
        }
        
        .no-image-header {
            background-color: rgba(99, 102, 241, 0.05);
            padding: 1rem 1.25rem;
            border-bottom: 1px solid var(--light-gray);
        }
        
        /* 响应式调整 */
        @media (max-width: 992px) {
            .featured-wish {
                grid-template-columns: 1fr;
            }
        }
        
        @media (max-width: 768px) {
            .wish-container {
                grid-template-columns: 1fr;
            }
            
            .page-title {
                font-size: 1.75rem;
            }
        }
        
        /* 加载更多按钮 */
        .load-more {
            display: block;
            margin: 2rem auto;
            background-color: white;
            border: 1px solid var(--primary);
            color: var(--primary);
            padding: 8px 24px;
            border-radius: 20px;
            font-size: 0.9rem;
            cursor: pointer;
            transition: var(--transition);
            display: flex;
            align-items: center;
            gap: 8px;
        }
        
        .load-more:hover {
            background-color: var(--primary);
            color: white;
        }
        
        /* 快速操作按钮 */
        .quick-actions {
            display: flex;
            gap: 8px;
            margin-top: 1rem;
        }
        
        .action-btn {
            flex: 1;
            padding: 6px 0;
            border-radius: 6px;
            font-size: 0.85rem;
            font-weight: 500;
            text-align: center;
            cursor: pointer;
            transition: var(--transition);
            border: none;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 5px;
        }
        
        .primary-action {
            background-color: var(--primary);
            color: white;
        }
        
        .primary-action:hover {
            background-color: #5B5FEF;
        }
        
        .secondary-action {
            background-color: rgba(99, 102, 241, 0.1);
            color: var(--primary);
        }
        
        .secondary-action:hover {
            background-color: rgba(99, 102, 241, 0.2);
        }
    </style>
</head>
<body>
    <div class="container py-4 px-4">
        <!-- 页面标题 -->
        <div class="page-header">
            <h1 class="page-title">为你推荐的礼物愿望</h1>
            <p class="page-subtitle">根据你的兴趣和好友动态，发现值得关注的礼物愿望</p>
            
            <!-- 推荐分类标签 -->
            <div class="recommendation-tabs">
                <div class="tab-item active">
                    <i class="fas fa-star"></i> 全部推荐
                </div>
                <div class="tab-item">
                    <i class="fas fa-heart"></i> 热门愿望
                </div>
                <div class="tab-item">
                    <i class="fas fa-user-friends"></i> 好友愿望
                </div>
                <div class="tab-item">
                    <i class="fas fa-clock"></i> 最新发布
                </div>
                <div class="tab-item">
                    <i class="fas fa-bolt"></i> 即将实现
                </div>
                <div class="tab-item">
                    <i class="fas fa-sync"></i> 为你刷新
                </div>
            </div>
        </div>
        
        <!-- 礼物愿望推荐容器 -->
        <div class="wish-container">
            <!-- 特色推荐 - 大图展示 -->
            <div class="featured-wish">
                <div class="image-container">
                    <img src="https://picsum.photos/800/600?random=10" alt="降噪耳机礼物愿望" class="featured-image">
                    <div class="recommendation-badge">好友的愿望</div>
                    <div class="price-tag">¥1500 左右</div>
                </div>
                <div class="featured-content">
                    <span class="wish-category">电子产品</span>
                    <h3 class="wish-title">希望拥有一款高品质降噪耳机，享受纯净音乐世界</h3>
                    <p class="wish-description">
                        每天通勤时间较长，希望能有一款降噪效果好的耳机，隔绝外界噪音，享受音乐或进行电话会议。看中了索尼WH-1000XM5和Bose QuietComfort Ultra，预算在1500-2000元左右。希望续航时间长一些，佩戴舒适。
                    </p>
                    
                    <div class="author-info">
                        <img src="https://picsum.photos/100/100?random=20" alt="音乐爱好者小芳的头像" class="author-avatar">
                        <div>
                            <div class="author-name">音乐爱好者小芳 <span class="badge bg-primary bg-opacity-10 text-primary text-xs">你的好友</span></div>
                            <div class="text-muted text-sm">发布于 3天前</div>
                        </div>
                    </div>
                    
                    <div class="quick-actions">
                        <button class="action-btn primary-action">
                            <i class="fas fa-gift"></i> 准备惊喜
                        </button>
                        <button class="action-btn secondary-action">
                            <i class="far fa-comment"></i> 聊聊细节
                        </button>
                    </div>
                    
                    <div class="wish-stats">
                        <div class="stat-item">
                            <i class="far fa-eye"></i>
                            <span>3.8k 浏览</span>
                        </div>
                        <div class="stat-item">
                            <i class="far fa-comment"></i>
                            <span>156 评论</span>
                        </div>
                        <div class="stat-item">
                            <i class="far fa-heart"></i>
                            <span>765 点赞</span>
                        </div>
                        <div class="stat-item">
                            <i class="far fa-bookmark"></i>
                            <span>321 收藏</span>
                        </div>
                    </div>
                </div>
            </div>
            
            <!-- 多图礼物1 -->
            <div class="wish-card">
                <div class="image-container" style="height: 180px;">
                    <div class="multi-images count-3">
                        <img src="https://picsum.photos/400/300?random=11" alt="露营装备展示图1" class="multi-image">
                        <img src="https://picsum.photos/400/300?random=12" alt="露营装备展示图2" class="multi-image">
                        <img src="https://picsum.photos/400/300?random=13" alt="露营装备展示图3" class="multi-image">
                    </div>
                    <div class="image-count">3图</div>
                    <div class="recommendation-badge">热门推荐</div>
                    <div class="price-tag">¥2000 左右</div>
                </div>
                <div class="card-body">
                    <span class="wish-category">户外装备</span>
                    <h3 class="wish-title">想要一套轻便的露营装备，周末去亲近大自然</h3>
                    <p class="wish-description">
                        想开始尝试露营，需要一套基础装备，包括帐篷、睡袋、防潮垫和便携炉具。希望装备轻便易携带，适合2-3人使用。
                    </p>
                    
                    <div class="author-info">
                        <img src="https://picsum.photos/100/100?random=21" alt="户外爱好者阿明的头像" class="author-avatar">
                        <div class="author-name">户外爱好者阿明</div>
                    </div>
                    
                    <div class="wish-stats">
                        <div class="stat-item">
                            <i class="far fa-eye"></i>
                            <span>2.1k 浏览</span>
                        </div>
                        <div class="stat-item">
                            <i class="far fa-comment"></i>
                            <span>98 评论</span>
                        </div>
                        <div class="stat-item">
                            <i class="far fa-heart"></i>
                            <span>456 点赞</span>
                        </div>
                        <div class="stat-item">
                            <i class="far fa-bookmark"></i>
                            <span>189 收藏</span>
                        </div>
                    </div>
                </div>
            </div>
            
            <!-- 无图礼物1 -->
            <div class="wish-card no-image-card">
                <div class="no-image-header">
                    <div class="recommendation-badge">最新发布</div>
                    <div class="price-tag">¥800 左右</div>
                </div>
                <div class="card-body no-image-body">
                    <span class="wish-category">书籍文具</span>
                    <h3 class="wish-title">想要一套专业摄影教程和后期处理书籍</h3>
                    <p class="wish-description">
                        刚入手了相机，希望能系统学习摄影知识，特别是人像和风光摄影技巧，以及Lightroom后期处理方法。
                    </p>
                    
                    <div class="author-info">
                        <img src="https://picsum.photos/100/100?random=22" alt="摄影新手小林的头像" class="author-avatar">
                        <div class="author-name">摄影新手小林</div>
                    </div>
                    
                    <div class="wish-stats">
                        <div class="stat-item">
                            <i class="far fa-eye"></i>
                            <span>345 浏览</span>
                        </div>
                        <div class="stat-item">
                            <i class="far fa-comment"></i>
                            <span>23 评论</span>
                        </div>
                        <div class="stat-item">
                            <i class="far fa-heart"></i>
                            <span>123 点赞</span>
                        </div>
                        <div class="stat-item">
                            <i class="far fa-bookmark"></i>
                            <span>56 收藏</span>
                        </div>
                    </div>
                </div>
            </div>
            
            <!-- 单图礼物1 -->
            <div class="wish-card">
                <div class="image-container" style="height: 180px;">
                    <img src="https://picsum.photos/400/300?random=14" alt="咖啡机图片" class="card-image">
                    <div class="recommendation-badge">为你推荐</div>
                    <div class="price-tag">¥1200 左右</div>
                </div>
                <div class="card-body">
                    <span class="wish-category">家居用品</span>
                    <h3 class="wish-title">希望有一台半自动咖啡机，每天享受现磨咖啡</h3>
                    <p class="wish-description">
                        每天都要喝两杯咖啡，希望能有一台家用半自动咖啡机，自己动手制作拿铁和卡布奇诺，提升生活品质。
                    </p>
                    
                    <div class="author-info">
                        <img src="https://picsum.photos/100/100?random=23" alt="咖啡爱好者阿强的头像" class="author-avatar">
                        <div class="author-name">咖啡爱好者阿强</div>
                    </div>
                    
                    <div class="wish-stats">
                        <div class="stat-item">
                            <i class="far fa-eye"></i>
                            <span>1.5k 浏览</span>
                        </div>
                        <div class="stat-item">
                            <i class="far fa-comment"></i>
                            <span>76 评论</span>
                        </div>
                        <div class="stat-item">
                            <i class="far fa-heart"></i>
                            <span>321 点赞</span>
                        </div>
                        <div class="stat-item">
                            <i class="far fa-bookmark"></i>
                            <span>145 收藏</span>
                        </div>
                    </div>
                </div>
            </div>
            
            <!-- 多图礼物2 -->
            <div class="wish-card">
                <div class="image-container" style="height: 180px;">
                    <div class="multi-images count-4">
                        <img src="https://picsum.photos/400/300?random=15" alt="烘焙工具图片1" class="multi-image">
                        <img src="https://picsum.photos/400/300?random=16" alt="烘焙工具图片2" class="multi-image">
                        <img src="https://picsum.photos/400/300?random=17" alt="烘焙工具图片3" class="multi-image">
                        <img src="https://picsum.photos/400/300?random=18" alt="烘焙工具图片4" class="multi-image">
                    </div>
                    <div class="image-count">4图</div>
                    <div class="recommendation-badge">热门推荐</div>
                    <div class="price-tag">¥600 左右</div>
                </div>
                <div class="card-body">
                    <span class="wish-category">厨房用具</span>
                    <h3 class="wish-title">想要一套专业烘焙工具，学习制作蛋糕和面包</h3>
                    <p class="wish-description">
                        对烘焙很感兴趣，希望能有一套基础烘焙工具，包括烤箱温度计、硅胶模具、裱花袋和各种搅拌工具。
                    </p>
                    
                    <div class="author-info">
                        <img src="https://picsum.photos/100/100?random=24" alt="烘焙爱好者小甜的头像" class="author-avatar">
                        <div class="author-name">烘焙爱好者小甜</div>
                    </div>
                    
                    <div class="wish-stats">
                        <div class="stat-item">
                            <i class="far fa-eye"></i>
                            <span>2.3k 浏览</span>
                        </div>
                        <div class="stat-item">
                            <i class="far fa-comment"></i>
                            <span>108 评论</span>
                        </div>
                        <div class="stat-item">
                            <i class="far fa-heart"></i>
                            <span>543 点赞</span>
                        </div>
                        <div class="stat-item">
                            <i class="far fa-bookmark"></i>
                            <span>210 收藏</span>
                        </div>
                    </div>
                </div>
            </div>
            
            <!-- 无图礼物2 -->
            <div class="wish-card no-image-card">
                <div class="no-image-header">
                    <div class="recommendation-badge">即将实现</div>
                    <div class="price-tag">¥500 左右</div>
                </div>
                <div class="card-body no-image-body">
                    <span class="wish-category">服务体验</span>
                    <h3 class="wish-title">希望能有一次专业的SPA按摩体验，放松身心</h3>
                    <p class="wish-description">
                        最近工作压力大，经常加班，希望能有一次全身SPA按摩，缓解疲劳和压力。最好是环境好一点的连锁品牌。
                    </p>
                    
                    <div class="author-info">
                        <img src="https://picsum.photos/100/100?random=25" alt="上班族大卫的头像" class="author-avatar">
                        <div class="author-name">上班族大卫</div>
                    </div>
                    
                    <div class="wish-stats">
                        <div class="stat-item">
                            <i class="far fa-eye"></i>
                            <span>1.1k 浏览</span>
                        </div>
                        <div class="stat-item">
                            <i class="far fa-comment"></i>
                            <span>67 评论</span>
                        </div>
                        <div class="stat-item">
                            <i class="far fa-heart"></i>
                            <span>289 点赞</span>
                        </div>
                        <div class="stat-item">
                            <i class="far fa-bookmark"></i>
                            <span>123 收藏</span>
                        </div>
                    </div>
                </div>
            </div>
            
            <!-- 双图礼物 -->
            <div class="wish-card">
                <div class="image-container" style="height: 180px;">
                    <div class="multi-images count-2">
                        <img src="https://picsum.photos/400/300?random=19" alt="智能手表图片1" class="multi-image">
                        <img src="https://picsum.photos/400/300?random=20" alt="智能手表图片2" class="multi-image">
                    </div>
                    <div class="image-count">2图</div>
                    <div class="recommendation-badge">好友的愿望</div>
                    <div class="price-tag">¥1800 左右</div>
                </div>
                <div class="card-body">
                    <span class="wish-category">智能设备</span>
                    <h3 class="wish-title">想要一款功能全面的智能手表，监测健康和运动数据</h3>
                    <p class="wish-description">
                        经常运动，希望能有一款智能手表，可以监测心率、睡眠质量和运动数据，最好支持独立通话功能。
                    </p>
                    
                    <div class="author-info">
                        <img src="https://picsum.photos/100/100?random=26" alt="运动达人阿健的头像" class="author-avatar">
                        <div class="author-name">运动达人阿健 <span class="badge bg-primary bg-opacity-10 text-primary text-xs">你的好友</span></div>
                    </div>
                    
                    <div class="wish-stats">
                        <div class="stat-item">
                            <i class="far fa-eye"></i>
                            <span>3.2k 浏览</span>
                        </div>
                        <div class="stat-item">
                            <i class="far fa-comment"></i>
                            <span>145 评论</span>
                        </div>
                        <div class="stat-item">
                            <i class="far fa-heart"></i>
                            <span>654 点赞</span>
                        </div>
                        <div class="stat-item">
                            <i class="far fa-bookmark"></i>
                            <span>289 收藏</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
        <!-- 加载更多按钮 -->
        <button class="load-more">
            <i class="fas fa-refresh"></i> 加载更多推荐
        </button>
    </div>

    <script>
        // 标签切换功能
        document.querySelectorAll('.tab-item').forEach(tab => {
            tab.addEventListener('click', function() {
                document.querySelectorAll('.tab-item').forEach(t => {
                    t.classList.remove('active');
                });
                this.classList.add('active');
                
                // 筛选不同推荐类型的礼物愿望
                const category = this.textContent.trim();
                showToast(`已切换到 "${category}"`);
            });
        });
        
        // 点赞功能
        document.querySelectorAll('.stat-item .fa-heart').forEach(icon => {
            icon.parentElement.addEventListener('click', function(e) {
                e.stopPropagation();
                
                const isLiked = this.classList.contains('text-primary');
                const countEl = this.querySelector('span');
                let count = parseInt(countEl.textContent.replace(/,|\s/g, ''));
                
                if (isLiked) {
                    this.classList.remove('text-primary');
                    icon.classList.remove('fas');
                    icon.classList.add('far');
                    count--;
                } else {
                    this.classList.add('text-primary');
                    icon.classList.remove('far');
                    icon.classList.add('fas');
                    count++;
                }
                
                countEl.textContent = count.toLocaleString() + ' 点赞';
                showToast(isLiked ? "取消点赞" : "点赞成功");
            });
        });
        
        // 收藏功能
        document.querySelectorAll('.stat-item .fa-bookmark').forEach(icon => {
            icon.parentElement.addEventListener('click', function(e) {
                e.stopPropagation();
                
                const isSaved = this.classList.contains('text-primary');
                const countEl = this.querySelector('span');
                let count = parseInt(countEl.textContent.replace(/,|\s/g, ''));
                
                if (isSaved) {
                    this.classList.remove('text-primary');
                    icon.classList.remove('fas');
                    icon.classList.add('far');
                    count--;
                } else {
                    this.classList.add('text-primary');
                    icon.classList.remove('far');
                    icon.classList.add('fas');
                    count++;
                }
                
                countEl.textContent = count.toLocaleString() + ' 收藏';
                showToast(isSaved ? "取消收藏" : "收藏成功");
            });
        });
        
        // 评论按钮点击
        document.querySelectorAll('.stat-item .fa-comment, .action-btn.secondary-action').forEach(btn => {
            btn.closest('.stat-item, .action-btn').addEventListener('click', function(e) {
                e.stopPropagation();
                const title = this.closest('.wish-card, .featured-wish').querySelector('.wish-title').textContent;
                showToast(`查看 "${title}" 的评论`);
            });
        });
        
        // 准备惊喜按钮点击
        document.querySelectorAll('.action-btn.primary-action').forEach(btn => {
            btn.addEventListener('click', function(e) {
                e.stopPropagation();
                const title = this.closest('.featured-wish').querySelector('.wish-title').textContent;
                showToast(`你准备为 "${title}" 准备惊喜，太棒了！`);
            });
        });
        
        // 卡片点击事件
        document.querySelectorAll('.wish-card, .featured-wish').forEach(card => {
            card.addEventListener('click', function() {
                const title = this.querySelector('.wish-title').textContent;
                showToast(`查看礼物愿望详情: ${title}`);
                // 实际应用中这里会跳转到详情页
                // window.location.href = 'wish-detail.html';
            });
        });
        
        // 加载更多按钮
        document.querySelector('.load-more').addEventListener('click', function() {
            this.innerHTML = '<i class="fas fa-spinner fa-spin"></i> 加载中...';
            
            // 模拟加载延迟
            setTimeout(() => {
                this.innerHTML = '<i class="fas fa-refresh"></i> 加载更多推荐';
                showToast('已加载更多礼物愿望推荐');
            }, 1500);
        });
        

    </script>
</body>
</html>

